<template>
    <div>
        <Table border :columns="columns" :data="tableData"></Table>
        <Modal v-model="removeModel" width="360">
            <p slot="header" style="color:#f60;">
                <Icon type="md-information-circled"></Icon>
                <span>信息提示</span>
            </p>
            <template>
                <Input v-model="reason" type="textarea" :rows="4" placeholder="请输入取消原因"></Input>
            </template>
            <div slot="footer">
                <Button type="success" @click="remove()" size="large">确定</Button>
                <Button type="info" @click="noRemove()" size="large">返回</Button>
            </div>
        </Modal>
    </div>
</template>

<script>
import ajax from '../../../../libs/axios.js'
export default {
    props: {
        tableData: Array,
        access: Object
    },
    data () {
        return {
            removeModel:false,
            partyModel: false,
            id: '',
            partySection: {},
            itemTotal: 0,
            mobile: '',
            columns: [
                {
                    title: '序号',
                    type: 'index',
                    width: 80,
                    align: 'center'
                },
                {
                    title: '订单编号',
                    align: 'center',
                    key: 'orderNo',
                    width:200
                },
                {
                    title: '购车订单',
                    align: 'center',
                    key: 'tradeOrderId',
                    width:120
                },
                {
                    title: '车辆信息',
                    align: 'center',
                    key: 'carSeries',
                    width:180
                },
                {
                    title: '始发城市',
                    align: 'center',
                    key: 'beginCity',
                    width:180
                },
                {
                    title: '目的地',
                    align: 'center',
                    key: 'endCity',
                    width:180
                },
                {
                    title: '状态',
                    align: 'center',
                    key: 'orderStatus',
                    width:90,
                    render: (h, params) => {
                        if (params.row.orderStatus === 1) {
                            return h('span', '待处理')
                        }  else if(params.row.orderStatus === 2) {
                            return h('span', '待确认')
                        } else if(params.row.orderStatus === 3) {
                            return h('span', '待安排')
                        } else if(params.row.orderStatus === 4) {
                            return h('span', '待发运')
                        } else if(params.row.orderStatus === 5) {
                            return h('span', '运输中')
                        } else if(params.row.orderStatus === 6) {
                            return h('span', '待收车')
                        } else if(params.row.orderStatus === 7) {
                            return h('span', '已完成')
                        } else if(params.row.orderStatus === -1) {
                            return h('span', '已取消')
                        }else {
                            return h('span', '其他')
                        }
                    }
                },
                {
                    title: '车商名称',
                    align: 'center',
                    key: 'partyName',
                    width:140,
                },
                {
                    title: '创建时间',
                    align: 'center',
                    key: 'createTime',
                    width:180,
                },
                {
                    title: '操作',
                    key: 'action',
                    width: 160,
                    align: 'center',
                    fixed:'right',
                    render: (h, params) => {
                        return h('div', [
                            h(
                                'Button',
                                {
                                    props: {
                                        type: 'success',
                                        size: 'small'

                                    },
                                    style: {
                                        marginRight: '5px',
                                        display: this.access.edit === true ? 'inline-block' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                            this.infoData(params.row.id)
                                        }
                                    }
                                },
                                '数据设置'
                            ),
                            h(
                                'Button',
                                {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.goRemove(params.index, params.row.id)
                                        }
                                    }
                                },
                                '取消'
                            )
                        ])
                    }
                }
            ],
            partyData: [],
            data: [],
            partyId:'',
            reason:'',
            company_status:0
        }
    },

    methods: {
        init () {
            this.partyData = [];
        },
        editData (id) {
            let argu = {
                id: id
            }
            this.$router.push({
                name: 'editcompany',
                params: argu
            })
        },
        infoData (id) {
            let argu = {
                id: id
            }
            this.$router.push({
                name: 'orderhandle_detail',
                params: argu
            })
        },
        goRemove (index, id) {
            this.removeModel = true
            this.id = id
            this.index = index
        },
        remove(){
            if(this.reason == ''){
                 this.$Notice.warning({
                    title: '警告',
                    desc:  '取消原因不能为空'
                });
            }else{
                let userId = window.localStorage.getItem('userId')
                let userName = window.localStorage.getItem('userName')
                let r = this.reason
                let order_id = this.id

                let url = 'adminlogin/transportOrder/updateTransportOrderStatusById'
                let data = {
                    order_id: order_id,
                    remark:r,
                    operator_id:userId,
                    operator:userName
                }
                ajax.formRes(url, data).then(res => {
                        if (res.code == 200) {
                            this.tableData.splice(this.index, 1)
                            // this.tableData[this.index].status = 0;
                            this.removeModel = false
                        }
                }).catch(res => {
                    console.log('有错误信息')
                    // fail
                })


            }

        },
        noRemove () {
            this.removeModel = false
        },
        cancel () {
            this.partySection = {}
            this.partyModel = false
        }
    },
    created: function () {
        this.init()
    },
    activated () {
        this.init()
    }
}
</script>
